import 'bootstrap/dist/css/bootstrap.css';
import '../css/style.scss';

$('.nav-all a[href="template.html"]').addClass('active');
import {templatedetail,log} from './urlconfig/config.js';

require('./common.js');
var token;
if(localStorage.token != null){
    token=localStorage.token
}

$(function (){
    $(".nav-list li").hover(function ()
    {
        var $this = $(this);
        $(".nav-list-item", $this).addClass("hover");
        $(".menu", $this).show();

    }, function ()
    {
        var $this = $(this);
        $(".nav-list-item", $this).removeClass("hover");
        $(".menu", $this).hide();

    });
})
function getQueryStringByName(name)
{
    var result = location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
    if (result == null || result.length < 1)
    {
        return "";
    }
    return result[1];
}



(function (){
    var id = getQueryStringByName("id");
    $.ajax({
        type: 'post',
        url: templatedetail,
        dataType: 'json',
        data: {
            token:token,
            tem_content_id: id
        },
        success: function (res) {
            if (res.code === 200) {
                console.log(res.data)
                var title='<div class="title">'+
                    '<h3 class="title-text">'+res.data.data.title+'</h3>'+
                    ' </div>'+
                    '<div class="main-box clearfix">'+
                    '<div class="main-pic">'+
                    '<img alt="'+res.data.data.title+'" src="'+res.data.data.detault_pic+'">'+
                    '</div>'+
                    '<div class="desc">'+
                    '<a class="btn-download" href="'+res.data.data.template_download_url+ '?id='+res.data.data.tem_content_id+'?title='+res.data.data.title+ '" ></a>'+
                    '</div>'+
                    '</div>'
                $(".picbox").prepend(title);
                console.log(res.data)
                $.each(res.data.pic, function (i, item) {
                    var ppt = '<li class="" parent_id="' + item.parent_id + '">' +
                        '<img src="'+item.picurl+'">'+
                        '</li>'
                    $(".template-content").append(ppt);
                });
                $(".pic-list").picShowcase({ itemWidth: 148, showNumber: 6, itemHeight: 92, mutilLine: true });
            }
        },
        error: function (err) {
            console.log(err)
        }
    })
})()



!(function ($)
{
    var defaults = {
        itemWidth: 100,
        itemHeight: 100,
        direction: "LTR",
        showNumber: 6,
        mutilLine: false
    };
    function picShowcase(options)
    {
        var settings = $.extend(true, {}, defaults, options);
        return this.each(function ()
        {
            var $this = $(this);
            var $items = $(".list-content ul li", $this);
            var itemLength = $items.length;
            if (settings.direction == "LTR")
            {
                var $list = $(".list-content ul", $this);
                if (settings.mutilLine && itemLength > 12)
                {
                    if (itemLength > 12)
                    {
                        $list.width(Math.ceil(itemLength / 18) * settings.itemWidth * 6);
                        $list.height(settings.itemHeight * 3);
                        $list.parent().height(settings.itemHeight * 3);
                        $list.parents(".picbox").css({ height: "auto" });
                        $list.parents(".pic-list").css({ overflow: "hidden", height: settings.itemHeight * 3 });
                        $list.parent().siblings(".arrow-left").height(settings.itemHeight * 3 - 25).css({ "background-position": "center center" });
                        $list.parent().siblings(".arrow-right").height(settings.itemHeight * 3 - 25).css({ "background-position": "center center" });
                        $("li", $list).css({ position: "absolute" }).each(function (i, v)
                        {
                            var row = Math.ceil(((i + 1) % 18) / 6);
                            if (row == 0)
                            {
                                row = 3;
                            }
                            var column = (i + 1) % 6;
                            if (column == 0)
                            {
                                column = 6;
                            }
                            var page = Math.ceil((i + 1) / 18);

                            $(v).css({ top: (row - 1) * settings.itemHeight, left: (column - 1) * settings.itemWidth + (page - 1) * settings.itemWidth * 6 });
                        });
                    }
                }
                else
                {
                    $list.width(itemLength * settings.itemWidth);
                    $list.parent().siblings(".arrow-left").css({"background":"url('http://sjws.superlbb.com/images/excel_left_default.png')no-repeat"});
                    $list.parent().siblings(".arrow-right").css({"background":"url('http://sjws.superlbb.com/images/excel_right_default.png')no-repeat"})
                }
            }
            else if (settings.direction == "TTB")
            {
                $(".list-content ul", $this).height(itemLength * settings.itemHeight);
            }
            var lastShowNo = (itemLength > settings.showNumber) ? settings.showNumber : itemLength;
            var firstShowNo = 1,
                currentPostion = 0;
            $(".arrow-left", $this).click(function ()
            {
                if (!(settings.mutilLine && itemLength > 12))
                {
                    if (firstShowNo > 1)
                    {
                        firstShowNo = (firstShowNo - settings.showNumber) > 1 ? (firstShowNo - settings.showNumber) : 1;
                        lastShowNo = (firstShowNo + settings.showNumber - 1) > itemLength ? itemLength : (firstShowNo + settings.showNumber - 1);
                        currentPostion = 0 - (settings.itemWidth * (firstShowNo - 1));
                        $(".list-content ul", $this).animate({ left: currentPostion }, 500);

                    }
                }
                else
                {
                    if (currentPostion != 0)
                    {
                        currentPostion = currentPostion - settings.itemWidth * 6;
                        currentPostion < 0 ? currentPostion = 0 : currentPostion;
                        $(".list-content ul", $this).animate({ left: currentPostion }, 500);
                    }
                }

            });
            $(".arrow-right", $this).click(function ()
            {
                if (!(settings.mutilLine && itemLength > 12))
                {
                    if (lastShowNo < itemLength)
                    {
                        lastShowNo = (lastShowNo + settings.showNumber) < itemLength ? (lastShowNo + settings.showNumber) : itemLength;
                        firstShowNo = (lastShowNo - settings.showNumber + 1) < 1 ? 1 : (lastShowNo - settings.showNumber + 1);
                        currentPostion = 0 - (settings.itemWidth * (firstShowNo - 1));
                        $(".list-content ul", $this).animate({ left: currentPostion }, 500);
                    }
                }
                else
                {
                    var minleft = 0 - ((Math.ceil(itemLength / 18) - 1) * settings.itemWidth * 6);
                    if (currentPostion > minleft)
                    {
                        currentPostion = currentPostion - settings.itemWidth * 6;
                        currentPostion < minleft ? currentPostion = minleft : currentPostion;
                        $(".list-content ul", $this).animate({ left: currentPostion }, 500);
                    }
                }

            });
            $(".arrow-up", $this).click(function ()
            {
                if (firstShowNo > 1)
                {
                    firstShowNo = (firstShowNo - settings.showNumber) > 1 ? (firstShowNo - settings.showNumber) : 1;
                    lastShowNo = (firstShowNo + settings.showNumber - 1) > itemLength ? itemLength : (firstShowNo + settings.showNumber - 1);
                    currentPostion = 0 - (settings.itemHeight * (firstShowNo - 1));
                    $(".list-content ul", $this).animate({ top: currentPostion }, 500);
                }
            });
            $(".arrow-down", $this).click(function ()
            {
                if (lastShowNo < itemLength)
                {
                    lastShowNo = (lastShowNo + settings.showNumber) < itemLength ? (lastShowNo + settings.showNumber) : itemLength;
                    firstShowNo = (lastShowNo - settings.showNumber + 1) < 1 ? 1 : (lastShowNo - settings.showNumber + 1);
                    currentPostion = 0 - (settings.itemHeight * (firstShowNo - 1));
                    $(".list-content ul", $this).animate({ top: currentPostion }, 500);
                }
            });

            //$(".arrow-left , .arrow-right", $this).hover(function ()
            //{
            //    $(this).css({ "background-images": "url('http://stimgcn1.s-msn.com/msnportal/officeplus/arrow-hover.png')", "background-color": "#c7c7c7" });
            //}, function ()
            //{
            //    $(this).css({ "background-images": "url('http://stimgcn1.s-msn.com/msnportal/officeplus/arrow.png')", "background-color": "transparent" });
            //});
            //
            //$(".arrow-up , .arrow-down", $this).hover(function ()
            //{
            //    $(this).css({ "background-images": "url('http://stimgcn1.s-msn.com/msnportal/officeplus/arrow-2-hover.png')", "background-color": "#c7c7c7" });
            //}, function ()
            //{
            //    $(this).css({ "background-images": "url('http://stimgcn1.s-msn.com/msnportal/officeplus/arrow-2.png')", "background-color": "transparent" });
            //});
            //$(".p_left").click(function ()
            //{
            //    var $prev = $(".pic-list .list-content ul li.selected").prev("li");
            //    if ($prev.length)
            //    {
            //        $prev.eq(0).trigger("click");
            //    }
            //})
            //$(".p_right").click(function ()
            //{
            //    var $next = $(".pic-list .list-content ul li.selected").next("li");
            //    if ($next.length)
            //    {
            //        $next.eq(0).trigger("click");
            //    }
            //})
            $items.click(function ()
            {
                $items.removeClass("selected");
                $(this).addClass("selected");

                $(".main-pic img").replaceWith("<div id='loadingText' style='height: 100%;width: 100%;color:#fff;font-size:32px;line-height:389px;text-align:center;background:transparent url(\"http://stimgcn1.s-msn.com/msnportal/officeplus/loading.gif\") no-repeat scroll center center;'></div>");
                var img = new Image();
                var imgSrc = $("img", $(this)).attr("src");
                img.src = imgSrc;
                if (img.complete)
                {
                    $(".main-pic #loadingText").replaceWith("<img alt='' src='" + imgSrc + "'/>");
                } else
                {
                    img.onload = function ()
                    {
                        $(".main-pic #loadingText").replaceWith("<img alt='' src='" + imgSrc + "'/>");
                        img.onload = null;
                    };
                }
            });

        });
    }
    $.fn.picShowcase = picShowcase;

    // public access to the default options object.
    $.fn.picShowcase.defaults = defaults;
})(jQuery);
var main=$("#fagepage").val();
var edition = localStorage.getItem("edition");
var channel = localStorage.getItem("channel");
var sys = localStorage.getItem("sys");
var cpuid = localStorage.getItem("cpuid");
var templateDetail = 'templateDetail_'+getQueryStringByName("id");
console.log(templateDetail)
$.ajax({
    type:'GET',
    url:log+ templateDetail+'/'+'pageShow' +'/'+ channel+'/'+ edition + '/'+cpuid,
    dataType: 'json',
    success:function(res) {
        if(res.code==200){
            console.log(res.msg)
        }
    },
    error:function(err) {
        console.log(err)
    }
});
$(".desc").click(function (){
    $.ajax({
        type:'GET',
        url:log+ main+'/'+'templateDownload' +'/'+ channel+'/'+ edition + '/'+cpuid,
        dataType: 'json',
        success:function(res) {
            if(res.code==200){
                console.log(res.msg)
            }
        },
        error:function(err) {
            console.log(err)
        }
    });
})